<template>
  <div style="width:100%">
    <!-- change-on-select 是否需要联动 -->
    <a-cascader
      :disabled="disabled"
      placeholder="请选择省市区"
      v-model="areaList"
      :options="options"
      @change="onChange"
      :field-names="{ label: 'name', value: 'code', children: 'children' }"
    />
  </div>
</template>
<script>
import address from './address.js'
export default {
  data() {
    return {
      options: address,
			areaList: []
    };
  },
	props: {
      value: {
        type: [String, Number],
        required: false
      },
      disabled: {
        type: Boolean,
        required: false
      }
    },
    created() {
    },
		watch: {
			value: {
				handler (val) {
					if (val) {
						this.areaList = this.value.split(',')
					} else {
						this.areaList = []
					}
				},
				immediate: true
			}
		},
		// computed: {
		// 	areaList () {
		// 		if (this.value) {
		// 			var splitAdd = this.value.split(',')
		// 		return splitAdd
		// 		} else {
		// 			return []
		// 		}
		// 	}
		// },
    methods: {
			onChange (e) {
				var s = e.toString();
				this.$emit('change', s)
			}
    },
		model: { prop: 'value', event: 'change' }
};
</script>
